<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
    <meta charset="UTF-8"/>
    <title> VAOI || Registro</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'/>
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <!-- Font Awesome Icons -->
    <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <!-- Ionicons -->
    <link href="../css/ionicons.min.css" rel="stylesheet" type="text/css" />
    <!-- Theme style -->
    <link href="../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
    <!-- AdminLTE Skins -->
    <link href="../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
    <link href="../css/login.css" rel="stylesheet" type="text/css"/>
	<link href="../css/formvalidation/formValidation.min.css" rel="stylesheet" type="text/css"/>

  </h:head>
  <h:body class="skin-green">
    <!-- Site wrapper -->
    <div class="wrapper">
      
      <header class="main-header">
        <a class="logo"><b>VAOI</b></a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top" role="navigation">
          <!-- Sidebar toggle button-->
          <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          
        </nav>
      </header>

      <!-- =============================================== -->
      <!-- Left side column. contains the sidebar -->
      <aside class="main-sidebar">
        <!-- sidebar: style can be found in sidebar.less -->
        <section class="sidebar">

          <!-- sidebar menu: : style can be found in sidebar.less -->
          <ul class="sidebar-menu">
		  
            <li class="header" >Panel de Navegación</li>
            
             <li>
              <a href="../home.xhtml">
                <i class="fa fa-home"></i> <span>Pagina Principal</span>
              </a>
            </li>  
            
             <li>
              <a href="../login.xhtml">
                <i class="fa fa-user"></i> <span>Iniciar Sesión</span>
              </a>
            </li>  
			
          </ul>
        </section>
        <!-- /.sidebar -->
      </aside>

      <!-- =============================================== -->

      <!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
		
        </section>

        <!-- Main content -->
        <section class="content">    
        


		<div class="omb_login">
			<h3 class="omb_authTitle">
				Registrar Admin
			</h3>

			<div class="row omb_row-sm-offset-4 omb_loginOr">
				<div class="col-xs-12 col-sm-6">
					<hr class="omb_hrOr" />
					<span class="omb_spanOr">o</span>
				</div>
			</div>

			<div class="row omb_row-sm-offset-4">
				<div class="col-xs-12 col-sm-6">
				
		    <p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()"/>               
			<p:dialog modal="true" widgetVar="statusDialog" header="Cargando"  draggable="false" closable="false" resizable="false">  
			<div class="progress progress-striped active">
                 <div class="progress-bar" role="progressbar"
                      aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                      style="width: 100%">
                      <span class="sr-only">Cargando</span>
                 </div>
            </div>	   
			</p:dialog>  
				
					<h:form id="regexpEmailForm"  autocomplete="off" >
					
					<p:messages id="messages" autoUpdate="true" closable="true" />
					
						<div class="form-group">
						   <div class="input-group">
							<span class="input-group-addon"><i class="fa fa-list-alt"></i></span>		
							<p:inputText class="form-control" name="nombres" value="#{usuariosView.txtNombre}" 
							placeholder="Nombre(s) y Apellido(s)" required="true"
							requiredMessage="El nombre es Requerido"/>									
						   </div>
						</div>
						<span class="help-block"></span>
					
						<div class="form-group">
						   <div class="input-group">
							<span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>		
							<p:inputText class="form-control" name="email" id="email" value="#{usuariosView.txtEmail}" 
							placeholder="Correo" required="true" validatorMessage="Email invalido"
							requiredMessage="El email es requerido">
							<f:validateRegex
		                       pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
 
	                        </p:inputText>					
						
						   </div>
						</div>
						<span class="help-block"></span>
									
						<div class="input-group">
							<span class="input-group-addon"><i class="fa fa-lock"></i></span>
							<p:password class="form-control" name="password" value="#{usuariosView.txtClave}"
								placeholder="Contraseña" required="true"
							requiredMessage="La contraseña es Requerida"/>		
						</div>
						<span class="help-block"></span>
						
						<br/>
						<div class="input-group">
							<span class="input-group-addon"><i class="fa fa-lock"></i></span>
								
							<p:password class="form-control" name="password2" value="#{usuariosView.txtClave2}"
								placeholder="Confirmar Contraseña" required="true"
							requiredMessage="La confirmacion de la contraseña es Requerida"/>		
						</div>
						<span class="help-block"></span>
						
						<br/>
						<p:commandButton class="btn btn-primary btn-block"
						value="Registrar" action="#{usuariosView.registroAdmin}" />
					</h:form>
			
				</div>
			</div>
			<br/>

		</div>

        </section><!-- /.content -->
      </div><!-- /.content-wrapper -->

      <footer class="main-footer">
        <div class="pull-right hidden-xs">
          <b>Version</b> 1.0
        </div>
        <strong>Copyright 2015-2016 <a href="http://almsaeedstudio.com">Almsaeed Studio</a>.</strong> All rights reserved.
      </footer>
    </div><!-- ./wrapper -->

    <!-- jQuery 2.1.3 
    <script src="../plugins/jQuery/jQuery-2.1.3.min.js"></script>-->
    <!-- Bootstrap 3.3.2 JS -->
    <script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <!-- AdminLTE App -->
    <script src="../dist/js/app.min.js" type="text/javascript"></script>
    <script src="../js/formValidation.min.js" type="text/javascript"></script>
    <script src="../js/framework/bootstrap.min.js" type="text/javascript"></script>
  </h:body>
</html>
